/*
   L.Robin ; version du 14 octobre 2016.
*/

.conteneur.de.script { position:fixed ; z-index:10 ;
   top:10px ; left:-960px ; height:750px ; width:960px ;
   min-height:80px ; resize:vertical ; overflow:hidden ; border:solid 7px brown ; 
   transition:left 1s ; background-color:lightblue }

.conteneur.de.script:not(.sorti):hover, .conteneur.de.script.sorti { left:0 ; z-index:100 }
.conteneur.de.script.sorti { box-shadow:0 0 10px magenta }
.conteneur.de.script  button { margin-top:5px }
.conteneur.de.script  button.exécuteur { margin-left:1em ; color:red }

.conteneur.de.script  .booléen 
   { display:inline-block ; margin-top:3px ; vertical-align:middle ; font-size:smaller }

.conteneur.de.script.transparent { opacity:0.35 }

.conteneur.de.script > .titre { margin:0 ; width:100% ; background-color:lightblue ; text-align:center ;
   border-bottom:solid 1px brown }

.conteneur.de.script > div.CodeMirror.cm-s-default
   { box-sizing:border-box ; margin-left:5px ; border:solid 1px gray ; border-top:none ;
     width:calc(100% - 10px) ; height:calc(100% - 50px) ; resize:none }

div.CodeMirror { background-color:beige }
div.CodeMirror  div.CodeMirror-selected { background-color:rgba(65,105,225,0.4) /* base : royalblue */ }

div.CodeMirror  pre.CodeMirror-line,
div.CodeMirror  div.CodeMirror-linenumber.CodeMirror-gutter-elt { line-height:1.6em }

div.CodeMirror  pre.CodeMirror-line:hover { background-color:rgba(255,0,0,0.2) }


body.vidéoprojeté  .conteneur.de.script { width:1200px ; height:800px }
body.vidéoprojeté  .conteneur.de.script:not(.sorti) { left:-1200px }
body.vidéoprojeté  .conteneur.de.script:not(.sorti):hover { left:0 }

body.vidéoprojeté  div.CodeMirror  pre.CodeMirror-line { font-size:26px }
body.vidéoprojeté  div.CodeMirror  div.CodeMirror-linenumber.CodeMirror-gutter-elt
  { font-size:18px ; text-align:center }

/*
   Pour les éléments syntaxiques de CodeMirror avec compléments linguistiques LR :
*/

div.CodeMirror  span.cm-keyword { color:forestgreen ; background-color:rgb(200,250,190) ;
   border-bottom:solid 1px forestgreen }
   
div.CodeMirror  span.cm-def { color:black }
div.CodeMirror  span.cm-number { color:blue }
div.CodeMirror  span.cm-string { color:rgb(160,50,160) ; outline:solid 1px silver }
div.CodeMirror  span.cm-property { color:purple ; background-color:rgb(200,200,200) ; border-radius:5px }

div.CodeMirror  span.cm-comment { color:gray ; background-color:rgba(0,0,0,0.1) ;
   border-top-left-radius:5px ; border-top-right-radius:5px }

div.CodeMirror  span.CodeMirror-matchingbracket
   { color:red ; font-weight:bold ; background-color:gold ; outline:3px solid rgba(255,215,0,0.5) }

div.CodeMirror  span.cm-variable.globale
   { border-radius:5px ; border-bottom:solid 1px forestgreen /* ou salmon */ }

div.CodeMirror  span.cm-variable.française
   { background:linear-gradient(to right, rgba(0,0,255,0.3), white, rgba(255,0,0,0.3)) }

auteur { position:fixed ; display:block ; right:0 ; bottom:0 ; padding:0.25em ; font-size:12px ;
   color:white ; background-color:black ; border:1px ridge silver ; border-right:none ; border-bottom:none }
auteur:before { content:"Conception du script graphique : "; color:silver }

auteur > * { padding:2px 3px 0 3px }
auteur > ads { color:black ; background-color:orange ; font-weight:bold ; margin-right:3px ;
   border-radius:3px }
auteur > tt { color:yellow ; font-size:90% ; background-color:maroon ; margin-left:3px }